<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>debounce</title>
</head>
<body>
<script>
    function delay(f,ms){
        return function (fn,...args){
            setTimeout(()=>{
                let res = f.apply(this,args)
                fn(res)
            },ms)
        }
    }
    let user ={
        age:20,
        getAge(nums){
            return this.age-nums
        }
    }
    // user.getAge = delay(user.getAge,2000)
    user.getAge = debounce(user.getAge,2000)
    user.getAge(res =>{
        console.log(res)
    },1)

    setTimeout(()=>{
        user.getAge(res =>{
            console.log(res)
        },2)
    },500)

    setTimeout(()=>{
        user.getAge(res =>{
            console.log(res)
        },2)
    },1000)


    setTimeout(()=>{
        user.getAge(res =>{
            console.log(res)
        },2)
    },1500)




    function debounce(f,ms){
        let timerId
        return function (fn,...args){

            clearTimeout(timerId)
            timerId = setTimeout(()=>{
                let res = f.apply(this,args)
                fn(res)
            },ms)
        }
    }


    function throttle(func, ms) {

        let isThrottled = false,
            savedArgs,
            savedThis;

        function wrapper() {

            if (isThrottled) { // (2)
                savedArgs = arguments;
                savedThis = this;
                return;
            }

            func.apply(this, arguments); // (1)

            isThrottled = true;

            setTimeout(function() {
                isThrottled = false; // (3)
                if (savedArgs) {
                    wrapper.apply(savedThis, savedArgs);
                    savedArgs = savedThis = null;
                }
            }, ms);
        }

        return wrapper;
    }




</script>
</body>
</html>